$(function() {
  // 全局变量
  var rowNum = 1,
    colNum = 1,
    flag=false,
    hasTable=true;//是否存在Table标识

  //数据管理
  var seatTable ={};
      seatTable.mtgid=1;
      seatTable.meet_model_id=1;


  // 单选框点击事件
  $("input:radio").click(function() {
    flag=true;
    var domName = $(this).attr("name");
    var checkedState = $(this).attr("checked");
    $("input:radio[name='" + domName + "']").attr("checked", false);
    $(this).attr("checked", true);
    if (checkedState == "checked") {
      $(this).attr("checked", false);
    }
    clear("definite");
  });

  // 自定义点击事件
  $(".definite").click(function() {   
    flag=false;
    this.onkeyup = function() {
      this.value = this.value.replace(/\D/g, "");
      if (this.value > 25) {
        this.value = 25;
      }
    };
    clear("radio");
  });

  //确定按钮点击
  function submitClick(){
  $("input:submit").click(function() {
      if(flag){
        if ($('.radio').eq(0).attr("checked")=="checked"){
            flag = false;
            rowNum = 10;
            colNum = 10;
            creatSeat(rowNum,colNum);
        }else if ($('.radio').eq(1).attr("checked")=="checked"){
            flag = false;
            rowNum = 20;
            colNum = 20;
            creatSeat(rowNum,colNum);
        }
    }else{
        if ($(".definite").eq(0).val() == " " || $(".definite").eq(1).val() == " ") {
            window.alert("请输入完整"); 
        } else if( $(".definite").eq(0).val()== 1 & $(".definite").eq(1).val() == 1) {
            window.alert("只能创建1x1以上的坐席表");
        }
          else {
            rowNum = $(".definite").eq(0).val();
            colNum = $(".definite").eq(1).val();
            creatSeat(rowNum,colNum);
        }
    }
    clear();  
  });
}
  // 清空输入
  function clear(input) {
    select = document.getElementById("mtgid");
    select.selectedIndex = 0;
    if (input == "radio") {
      var radio = document.querySelectorAll(".radio");
      for (let i = 0; i < radio.length; i++) {
        radio[i].checked = false;
      }
    } else if (input == "definite") {
      var definite = document.querySelectorAll(".definite");
      for (let i = 0; i < definite.length; i++) {
        if (definite[i].value != " ") {
          definite[i].value = " ";
        }
      }
    } else if ((input = " ")) {
      clear("radio");
      clear("definite");
    }
  }



//创建座席
var tbody = document.getElementById("seatTable");
function creatSeat(rows, cols) {
  if (rows.length==0 & cols.length == 0) {
    return;
  } else {
    rows = Number(rows);
    cols = Number(cols);  
    tbody.innerHTML=" ";
    for(var x=0;x<rows;x++){ 
      var trNode=tbody.insertRow(); 
       var xx = 0;
       xx+=x*cols;
      for(var y=0;y<cols;y++){ 
       var tdNode=trNode.insertCell(); 
       tdNode.innerHTML="<div>"+(x+1)+"-"+(y+1)+"</div>";
       tdNode.setAttribute("xh",xx+y);
       tdNode.setAttribute("row",x+1);
       tdNode.setAttribute("col",y+1); 
      } 
     } 
  }
  cellClick()
}

//标识点击
// 1 摄像机 2过道 3席座 4等待 5工作人员
var symbol= 2;
$(".symbol__content>ul>li").click(function(){
  symbol=$(this).index()+1;
})
//单元格点击事件
function cellClick(){
var tds = $("#seatTable td");
   seatTable.Data=[];
for(var i=0;i<tds.length;i++){
   seatTable.Data[i] = {};
   seatTable.Data[i].xh = parseInt(tds.eq(i).attr("xh"));
   seatTable.Data[i].row = parseInt(tds.eq(i).attr("row"));
   seatTable.Data[i].col = parseInt(tds.eq(i).attr("col"));
   seatTable.Data[i].symbol = parseInt(symbol)
    tds.eq(i).css("background-color","rgb(255,248,205)")
    tds.eq(i).click(function(i){
      return function(){
       switch(symbol){   
         case 1: $(this).css("background-color","rgb(220,252,202)");$(this).html("<div>"+"摄"+"</div>");seatTable.Data[i].symbol=1;break;
         case 2: $(this).css("background-color","rgb(255,248,204)");$(this).html("<div>"+seatTable.Data[i].row+"-"+seatTable.Data[i].col+"</div>");seatTable.Data[i].symbol=2;break;
         case 3: $(this).css("background-color","rgb(203,233,243)");$(this).html("<div>"+"座"+"</div>");seatTable.Data[i].symbol=3;break;
         case 4: $(this).css("background-color","rgb(253,222,202)");$(this).html("<div>"+"等"+"</div>");seatTable.Data[i].symbol=4;break;
         case 5: $(this).css("background-color","rgb(240,203,254)");$(this).html("<div>"+"工"+"</div>");seatTable.Data[i].symbol=5;break;
       }
      }
    }(i)
  )
}
  document.onselectstart =function(){return false};
  window.getSelection? window.getSelection().removeAllRanges() : document.selection.empty();
}
//渲染座表
Table={"mtgid":1,"meet_model_id":1,"Data":[{"xh":0,"row":1,"col":1,"symbol":3},{"xh":1,"row":1,"col":2,"symbol":2},{"xh":2,"row":1,"col":3,"symbol":2},{"xh":3,"row":1,"col":4,"symbol":2},{"xh":4,"row":1,"col":5,"symbol":2},{"xh":5,"row":1,"col":6,"symbol":2},{"xh":6,"row":1,"col":7,"symbol":2},{"xh":7,"row":1,"col":8,"symbol":2},{"xh":8,"row":1,"col":9,"symbol":2},{"xh":9,"row":1,"col":10,"symbol":2},{"xh":10,"row":2,"col":1,"symbol":2},{"xh":11,"row":2,"col":2,"symbol":2},{"xh":12,"row":2,"col":3,"symbol":2},{"xh":13,"row":2,"col":4,"symbol":2},{"xh":14,"row":2,"col":5,"symbol":2},{"xh":15,"row":2,"col":6,"symbol":2},{"xh":16,"row":2,"col":7,"symbol":2},{"xh":17,"row":2,"col":8,"symbol":2},{"xh":18,"row":2,"col":9,"symbol":2},{"xh":19,"row":2,"col":10,"symbol":2},{"xh":20,"row":3,"col":1,"symbol":2},{"xh":21,"row":3,"col":2,"symbol":2},{"xh":22,"row":3,"col":3,"symbol":2},{"xh":23,"row":3,"col":4,"symbol":2},{"xh":24,"row":3,"col":5,"symbol":2},{"xh":25,"row":3,"col":6,"symbol":2},{"xh":26,"row":3,"col":7,"symbol":2},{"xh":27,"row":3,"col":8,"symbol":2},{"xh":28,"row":3,"col":9,"symbol":2},{"xh":29,"row":3,"col":10,"symbol":2},{"xh":30,"row":4,"col":1,"symbol":2},{"xh":31,"row":4,"col":2,"symbol":2},{"xh":32,"row":4,"col":3,"symbol":2},{"xh":33,"row":4,"col":4,"symbol":2},{"xh":34,"row":4,"col":5,"symbol":2},{"xh":35,"row":4,"col":6,"symbol":2},{"xh":36,"row":4,"col":7,"symbol":2},{"xh":37,"row":4,"col":8,"symbol":2},{"xh":38,"row":4,"col":9,"symbol":2},{"xh":39,"row":4,"col":10,"symbol":2},{"xh":40,"row":5,"col":1,"symbol":2},{"xh":41,"row":5,"col":2,"symbol":2},{"xh":42,"row":5,"col":3,"symbol":2},{"xh":43,"row":5,"col":4,"symbol":2},{"xh":44,"row":5,"col":5,"symbol":2},{"xh":45,"row":5,"col":6,"symbol":2},{"xh":46,"row":5,"col":7,"symbol":2},{"xh":47,"row":5,"col":8,"symbol":2},{"xh":48,"row":5,"col":9,"symbol":2},{"xh":49,"row":5,"col":10,"symbol":2},{"xh":50,"row":6,"col":1,"symbol":2},{"xh":51,"row":6,"col":2,"symbol":2},{"xh":52,"row":6,"col":3,"symbol":2},{"xh":53,"row":6,"col":4,"symbol":2},{"xh":54,"row":6,"col":5,"symbol":2},{"xh":55,"row":6,"col":6,"symbol":2},{"xh":56,"row":6,"col":7,"symbol":2},{"xh":57,"row":6,"col":8,"symbol":2},{"xh":58,"row":6,"col":9,"symbol":2},{"xh":59,"row":6,"col":10,"symbol":2},{"xh":60,"row":7,"col":1,"symbol":2},{"xh":61,"row":7,"col":2,"symbol":2},{"xh":62,"row":7,"col":3,"symbol":2},{"xh":63,"row":7,"col":4,"symbol":2},{"xh":64,"row":7,"col":5,"symbol":3},{"xh":65,"row":7,"col":6,"symbol":3},{"xh":66,"row":7,"col":7,"symbol":3},{"xh":67,"row":7,"col":8,"symbol":2},{"xh":68,"row":7,"col":9,"symbol":2},{"xh":69,"row":7,"col":10,"symbol":2},{"xh":70,"row":8,"col":1,"symbol":2},{"xh":71,"row":8,"col":2,"symbol":2},{"xh":72,"row":8,"col":3,"symbol":2},{"xh":73,"row":8,"col":4,"symbol":2},{"xh":74,"row":8,"col":5,"symbol":2},{"xh":75,"row":8,"col":6,"symbol":3},{"xh":76,"row":8,"col":7,"symbol":3},{"xh":77,"row":8,"col":8,"symbol":2},{"xh":78,"row":8,"col":9,"symbol":2},{"xh":79,"row":8,"col":10,"symbol":2},{"xh":80,"row":9,"col":1,"symbol":2},{"xh":81,"row":9,"col":2,"symbol":2},{"xh":82,"row":9,"col":3,"symbol":2},{"xh":83,"row":9,"col":4,"symbol":2},{"xh":84,"row":9,"col":5,"symbol":2},{"xh":85,"row":9,"col":6,"symbol":2},{"xh":86,"row":9,"col":7,"symbol":2},{"xh":87,"row":9,"col":8,"symbol":2},{"xh":88,"row":9,"col":9,"symbol":2},{"xh":89,"row":9,"col":10,"symbol":2},{"xh":90,"row":10,"col":1,"symbol":2},{"xh":91,"row":10,"col":2,"symbol":2},{"xh":92,"row":10,"col":3,"symbol":2},{"xh":93,"row":10,"col":4,"symbol":2},{"xh":94,"row":10,"col":5,"symbol":2},{"xh":95,"row":10,"col":6,"symbol":2},{"xh":96,"row":10,"col":7,"symbol":2},{"xh":97,"row":10,"col":8,"symbol":2},{"xh":98,"row":10,"col":9,"symbol":2},{"xh":99,"row":10,"col":10,"symbol":2}]}
function render(){
  var dataLen = Table.Data.length;
  var rows = Table.Data[dataLen - 1].row;
  var cols = Table.Data[dataLen - 1].col;
  if ((rows == 0) & (cols == 0)) {
    return;
  } else {
    creatSeat(rows,cols);
    var tds = $("#seatTable td");
    for(var i=0;i<dataLen;i++){
      (function(i) {
        switch (Table.Data[i].symbol) {
          case 1: tds.eq(i).css("background-color","rgb(220,252,202)");tds.eq(i).html("<div>"+"摄"+"</div>");break;
          case 2: tds.eq(i).css("background-color","rgb(255,248,204)");tds.eq(i).html("<div>"+seatTable.Data[i].row+"-"+seatTable.Data[i].col+"</div>");break;
          case 3: tds.eq(i).css("background-color","rgb(203,233,243)");tds.eq(i).html("<div>"+"座"+"</div>");break;
          case 4: tds.eq(i).css("background-color","rgb(253,222,202)");tds.eq(i).html("<div>"+"等"+"</div>");break;
          case 5: tds.eq(i).css("background-color","rgb(240,203,254)");tds.eq(i).html("<div>"+"工"+"</div>");break;
        }
      })(i)
    }
  }
}
//mtgid更改
function selectChange(){
select = document.getElementById("mtgid");
select.onchange=function(Table){
  hasTable=false;
  render();
}
}    

//ajax
// //首先向后台获取会议ID 会议模板Id
// function getMeetingId(){
  
// }
//点击下一步
// $("#next").click(nextStep(seatTable))
$("#next").click(function(){
  if(hasTable){

  }else{
    seatTable=Table;
  }
  // window.location.href="../arrSeats/arrSeats.html"
  console.log(JSON.stringify(seatTable))
 })

// function nextStep(data) {
//   $.ajax({
//     type: "post",
//     contentType: "application/x-www-form-urlencoded; charset=utf-8",
//     url: xxxx,
//     async: false, 
//     data:data,
//     dataType: "json",
//     success: function() {
//       window.location.href ="xxx/userpz.jsp?mtgid=" + seatTable.mtgid + "&meet_model_id=" + seatTable.meet_model_id;
//     }
//   });
// };

//初始化表格
creatSeat(10,10)
submitClick()
selectChange();
});